<template>
  <div class="set-param">
    <el-form-item label="设置参数：">
      <el-select class="param-select" v-model="day" placeholder="日期">
        <el-option
          v-for="item in dayOption"
          :key="0"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-select class="param-select" v-model="hour" placeholder="小时">
        <el-option
          v-for="item in hourOption"
          :key="0"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-select class="param-select" v-model="minite" placeholder="分钟">
        <el-option
          v-for="item in miniteOption"
          :key="0"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-radio class="radio" v-model="model" label="1">1</el-radio>
      <el-radio class="radio" v-model="model" label="2">2</el-radio>
      <el-radio class="radio" v-model="model" label="3">3</el-radio>
      <el-input v-model="setParam" class="param-content" placeholder="请选择内容" :disabled="true"></el-input>
    </el-form-item>
  </div>
</template>

<script>
  import { dayOption, hourOption, miniteOption } from 'api/staticParam'

  export default {
    data () {
      return {
        dayOption: [],
        day: '',
        hourOption: [],
        hour: '',
        miniteOption: [],
        minite: '',
        model: ''
      }
    },
    created () {
      this.dayOption = dayOption
      this.hourOption = hourOption
      this.miniteOption = miniteOption
    },
    computed: {
      setParam () {
        let paramDay = ''
        let paramHour = ''
        let paramMinite = ''
        if (!this.day) {
          paramDay = ''
        } else {
          paramDay = this.day < 10 ? ('0' + this.day + '日') : this.day + '日'
        }
        if (!this.hour) {
          paramHour = ''
        } else {
          paramHour = this.hour < 10 ? ('0' + this.hour + '时') : this.hour + '时'
        }
        if (!this.minite) {
          paramMinite = ''
        } else {
          paramMinite = this.minite < 10 ? ('0' + this.minite + '分') : this.minite + '分'
        }
        return paramDay + paramHour + paramMinite + this.model
      }
    }
  }
</script>
<style lang="stylus" type="text/stylus" rel="stylesheet/stylus">
  .set-param
    .param-select
      & > .el-input
        width: 75px
    .param-content.is-disabled
      width: 220px
</style>
